Vue.component('Add', {
    template: `
		<el-dialog title="添加奖品" width="600px" class="icon-dialog" :visible.sync="show" @open="open" :before-close="closeForm" append-to-body>
			<el-form :size="size" ref="form" :model="form" :rules="rules" :label-width=" ismobile()?'90px':'16%'">
				<el-row >
					<el-col :span="24">
						<el-form-item label="奖品名称" prop="name">
							<el-input  v-model="form.name" autoComplete="off" clearable  placeholder="请输入奖品名称"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row >
					<el-col :span="24">
						<el-form-item label="奖品概率" prop="probability">
							<el-input  v-model="form.probability" autoComplete="off" clearable placeholder="请输入奖品概率"></el-input>
							<small style="color: rgb(192, 196, 204);">数字越大概率越高</small>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row >
					<el-col :span="24">
						<el-form-item label="会员等级" prop="level_id">
							<el-select   style="width:100%" v-model="form.level_id" filterable clearable placeholder="请选择所属分类">
								<el-option v-for="(item,i) in level" :key="i" :label="item.name" :value="item.id"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row >
					<el-col :span="24">
						<el-form-item label="奖品图片" prop="pic">
							<Upload v-if="show" size="small"  file_type="image" filterable :image.sync="form.pic"></Upload>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row >
					<el-col :span="24">
						<el-form-item label="奖品类型" prop="type">
							<el-select   style="width:100%" v-model="form.type" filterable clearable placeholder="请选择所属分类">
								<el-option v-for="(item,i) in type_list" :key="i" :label="item.name" :value="item.id"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
                <el-row >
					<el-col :span="24">
						<el-form-item label="奖品数量" prop="num">
							<el-input  v-model="form.num" autoComplete="off" filterable clearable placeholder="请输入奖品数量"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button :size="size" :loading="loading" type="primary" @click="submit" >
					<span v-if="!loading">确 定</span>
					<span v-else>提 交 中...</span>
				</el-button>
				<el-button :size="size" @click="closeForm">取 消</el-button>
			</div>
		</el-dialog>
	`,
    components:{
    },
    props: {
        show: {
            type: Boolean,
            default: false
        },
        size: {
            type: String,
            default: 'small'
        },
    },
    data(){
        return {
            form: {
                name:'',
                probability:'',
                pic:'',
                level_id:'',
                type:'',
                num:'',
                prize:0,
            },
            loading:false,
            level:[],
            type_list:[{'id':1,'name':'USDT'},{'id':2,'name':'MMST'},{'id':3,'name':'分红点'}],
            rules: {
                name:[
                    {required: true, message: '奖品名称不能为空', trigger: 'blur'},
                ],
                probability:[
                    {required: true, message: '概率不能为空', trigger: 'blur'},
                ],
                level_id:[
                    {required: true, message: '归属会员不能为空', trigger: 'blur'},
                ],
                type:[
                    {required: true, message: '奖励类型不能为空', trigger: 'blur'},
                ],
                pic:[
                    {required: true, message: '奖品图片不能为空', trigger: 'blur'},
                ],
            }
        }
    },
    watch:{
        show(val){
            if(val){
                axios.post(base_url + '/MemberLevel/getList').then(res => {
                    if(res.data.status == 200){
                        this.level = res.data.data
                    }
                })
            }
        }
    },
    methods: {
        open(){
        },
        submit(){
            this.$refs['form'].validate(valid => {
                if(valid) {
                    this.loading = true
                    axios.post(base_url + '/Draw/add',this.form).then(res => {
                        if(res.data.status == 200){
                            this.$message({message: res.data.msg, type: 'success'})
                            this.$emit('refesh_list')
                            this.closeForm()
                        }else{
                            this.loading = false
                            this.$message.error(res.data.msg)
                        }
                    }).catch(()=>{
                        this.loading = false
                    })
                }
            })
        },
        closeForm(){
            this.$emit('update:show', false)
            this.loading = false
            if (this.$refs['form']!==undefined) {
                this.$refs['form'].resetFields()
            }
        },
    }
})
